<template>
  <div class="content-wrapper">
    <div class="content-header">待办事项</div>
    <div class="content-container">
    <el-tabs v-model="activeTab">
      <el-tab-pane label="生产任务" name="apply">
        <el-table
          height="500"
          v-loading="listLoading"
          :data="list"
          highlight-current-row
        >
          <el-table-column
            label="产品项目"
            prop="productDictValue"
            min-width="100px"
          />
          <el-table-column
            label="产品子项"
            prop="subProductDictValue"
            min-width="100px"
          />
          <el-table-column
            label="生产工艺"
            prop="techDocumentName"
            min-width="100px"
          />
          <el-table-column
            label="批号"
            prop="batchCode"
            width="100px"
            align="center"
          />
          <el-table-column label="备注" prop="memo" min-width="100px" />
          <el-table-column label="下发人" prop="createUserName" width="100px" />
          <el-table-column label="下发时间" prop="sendTime" width="160px" />
          <!-- <el-table-column label="状态" prop="status" width="100px">
            <template slot-scope="{ row }">
              <el-tag v-if="row.status == 1" type="success">下发</el-tag>
              <el-tag v-if="row.status == 0" type="danger">未下发</el-tag>
              <el-tag v-if="row.status == 2" type="info">取消</el-tag>
            </template>
          </el-table-column> -->
          <el-table-column
            label="操作"
            align="center"
            width="80px"
            fixed="right"
          >
            <template slot-scope="{ row, $index }">
              <el-dropdown trigger="click" class="filter-item">
                <el-button type="text" class="el-icon-more" />
                <el-dropdown-menu slot="dropdown" class="user-dropdown">
                  <el-dropdown-item @click.native="viewFile(row)">查看</el-dropdown-item>
                  <el-dropdown-item @click.native="addManufactureRecord(row)">开始记录</el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="QA审核" name="second">
        <el-table
          height="500"
          v-loading="listLoading"
          :data="qaPageList"
          highlight-current-row
        >
          <el-table-column
            label="产品项目"
            prop="productDictValue"
            min-width="200px"
          />
          <el-table-column
            label="产品子项"
            prop="subProductDictValue"
            min-width="200px"
          >
            <template slot-scope="{ row }">
              {{ row.subProductDictValue || '没有子项' }}
            </template>
          </el-table-column>
          <el-table-column
            label="批号"
            prop="batchCode"
            width="150px"
            align="center"
          />
          <el-table-column label="提交人" prop="checkUserName" width="100px" />
          <el-table-column label="提交时间" prop="createTime" width="160px" />
          <el-table-column
            label="操作"
            align="center"
            width="150px"
            fixed="right"
          >
            <template slot-scope="{ row }">
              <el-dropdown trigger="click" class="filter-item">
                <el-button type="text" class="el-icon-more" />
                <el-dropdown-menu slot="dropdown" class="user-dropdown">
                  <el-dropdown-item @click.native="getView(row)"
                    >查看</el-dropdown-item
                  >
                  <el-dropdown-item @click.native="pushCheck(row)"
                    >审核通过</el-dropdown-item
                  >
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="修改申请" name="third">
        <el-table
          height="500"
          v-loading="listLoading"
          :data="modifyList"
          highlight-current-row
        >
          <el-table-column
            label="产品项目"
            prop="productDictValue"
            min-width="100px"
          />
          <el-table-column
            label="产品子项"
            prop="subProductDictValue"
            min-width="100px"
          >
            <template slot-scope="{ row }">
              {{ row.subProductDictValue || '没有子项' }}
            </template>
          </el-table-column>
          <el-table-column
            label="批号"
            prop="batchCode"
            width="100px"
            align="center"
          />
          <el-table-column label="申请人" prop="createUserName" width="100px" />
          <el-table-column label="申请原因" prop="reason" min-width="100px" />
          <el-table-column label="申请时间" prop="createTime" width="160px" />
          <el-table-column
            label="操作"
            align="center"
            width="80px"
            fixed="right"
          >
            <template slot-scope="{ row }">
              <el-dropdown trigger="click" class="filter-item">
                <el-button type="text" class="el-icon-more" />
                <el-dropdown-menu slot="dropdown" class="user-dropdown">
                  <!-- <el-dropdown-item>查看</el-dropdown-item> -->
                  <el-dropdown-item @click.native="modificationStatus(row)"
                    >同意修改</el-dropdown-item
                  >
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
    <pagination
      v-show="total > 0"
      :total="total"
      :page-number.sync="listQuery.pageNumber"
      :page-size.sync="listQuery.pageSize"
      @pagination="getDataList"
    />
    <el-dialog title="批生产列表" :visible.sync="viewDialog">
      <el-table :data="dataList.data">
        <el-table-column
          property="productDictValue"
          label="产品项目"
          width="150"
        ></el-table-column>
        <el-table-column
          property="subProductDictValue"
          label="产品子项"
          width="200"
        ></el-table-column>
        <el-table-column property="batchCode" label="批号"></el-table-column>
        <el-table-column
          property="status"
          label="状态"
          :formatter="
            (row, column, cellValue, index) => {
              return recordStatus[cellValue]
            }
          "
        ></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="{ row }">
            <el-button size="mini" type="success" @click="viewRecordFile(row)">查看文件</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    </div>
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import {
  pageReleased,
  modifyRecordPage,
  updateModificationStatus,
  getQaPage,
  viewLotProduction,
  pushCheck
} from '@/api/rs/manufacture.js'
import { get } from '@/api/rs/technique.js'
import { save } from '@/api/rs/manufactureRecord.js'
export default {
  components: { Pagination },
  data() {
    return {
      viewDialog: false,
      status: {
        0: '未下发',
        1: '下发',
        2: '已取消'
      },
      recordStatus: {
        0: '未记录',
        1: '记录中',
        2: '记录异常',
        3: '提交修改',
        4: '提交批生产记录',
      },
      activeTab: 'apply',
      listLoading: false,
      list: [{}],
      listQuery: {
        pageNumber: 1,
        pageIndex: 0,
        pageSize: 10
      },
      total: 999,
      modifyList: [],
      qaPageList: [],
      dataList: {}
    }
  },
  mounted() {
    this.getDataList()
  },
  methods: {
    addManufactureRecord(row){//开始生产记录
      let requestData = {
        manufactureApplyId: row.manufactureApplyId,
        productDictCode: row.productDictCode,
        subProductDictCode: row.subProductDictCode,
        batchCode: row.batchCode,
        techniqueId: row.techniqueId
      }
      save(requestData).then(res => {
        //跳转我的记录页面
        this.$router.push("/manufacture/manufacture_list_record")
      })
    },
    viewRecordFile(row){//查看记录文档
      console.log(row, 'row')

      window.open(
        'onlyoffice/createDocument.html?&token=' +
        this.$store.getters.token +
        '&documentId=' +
        row.dataRecordId +
        '&mode=view' +
        '&urldata=' +
        process.env.VUE_APP_BASE_API
      )
    },
    viewFile(row){//查看文档
      get({techniqueId: row.techniqueId}).then(res => {
        window.open(
          'onlyoffice/createDocument.html?&token=' +
          this.$store.getters.token +
          '&documentId=' +
          res.data.documentId +
          '&mode=view' +
          '&urldata=' +
          process.env.VUE_APP_BASE_API
        )
      })
    },
    //分页
    getDataList() {
      this.listQuery.pageIndex = this.listQuery.pageNumber - 1
      pageReleased(this.listQuery).then((res) => {
        this.list = res.data.rows
        this.total = res.data.total
      })
      getQaPage(this.listQuery).then((res) => {
        this.qaPageList = res.data.rows
        this.total = res.data.total
        console.log(this.qaPageList, 'this.qaPageList')
      })
      modifyRecordPage(this.listQuery).then((res) => {
        this.modifyList = res.data.rows
        this.total = res.data.total
      })
    },
    // 修改状态
    modificationStatus(row) {
      let manufactureRecordModifyApplyId = Number(
        row.manufactureRecordModifyApplyId
      )
      let data = {
        manufactureRecordModifyApplyId: manufactureRecordModifyApplyId,
        status: 1
      }
      updateModificationStatus(data).then((res) => {
        if (res.code == 1) {
          this.$message({
            message: '修改成功',
            type: 'success'
          })
          this.getDataList()
        }
      })
    },
    // 查看Qa审核
    async getView(row) {
      this.viewDialog = true
      let data = { manufactureArchiveId: row.manufactureArchiveId }
      this.dataList = await viewLotProduction(data)
    },
    // 提交qa审核
    pushCheck(row) {
      let data = {
        manufactureArchiveId: row.manufactureArchiveId
      }
      pushCheck(data).then((res) => {
        if (res.code == 1) {
          this.$message.success('提交成功')
          this.getDataList()
        }
      })
    }
  }
}
</script>
